<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let str = new String('字符串'); // 构造函数定义
        console.log(str); // String {"字符串"}
        console.log(typeof str); // object
        // 字面量定义
        let s = "字符串";
        console.log(s);  // 字符串
        console.log(typeof s);  // string
        document.write('<h2>字符串标签模板</h2>');
        const list = [
            {title:'A',name:'张三'},
            {title:'B',name:'李思'},
            {title:'C',name:'王五'}
        ];

        function createEl(){
            return `<ul>
                ${list.map(item=>links`<li>课程：${item.title},作者：${item.name}</li>`).join("")}
                </ul>
            `;
        }
        function links(strings,...vars){
            return strings.map((str,key)=>{
               return str + (vars[key]?`<a href="javascript:void(0)">${vars[key]}</a>`:'') 
            }).join('');
        };
        document.body.innerHTML += createEl();

        let namea = 'zhWenHua';
        console.log(namea.toUpperCase());
        console.log(namea.toLowerCase());

        console.log(namea.charAt(1));
        console.log(namea[1]);
        for(let i=0;i<namea.length;i++){
            let span = document.createElement('span');
            span.innerHTML = namea[i];
            span.style.fontSize = (i+1)*10+'px'; 
            document.body.append(span)
        }
    </script>
</body>
</html>